$pf-c-tree-view--MaxNesting: 10;

.pf-c-tree-view {
  --pf-c-tree-view--PaddingTop: var(--pf-global--spacer--sm);
  --pf-c-tree-view--PaddingBottom: var(--pf-global--spacer--sm);

  // Link base
  --pf-c-tree-view__node--indent--base: var(--pf-global--spacer--sm);
  --pf-c-tree-view__node--nested-indent--base: var(--pf-global--spacer--lg);
  --pf-c-tree-view__item--m-expandable__node--nested-indent--base: var(--pf-global--spacer--lg);

  // Link
  --pf-c-tree-view__node--PaddingTop: var(--pf-global--spacer--sm);
  --pf-c-tree-view__node--PaddingRight: var(--pf-global--spacer--sm);
  --pf-c-tree-view__node--PaddingBottom: var(--pf-global--spacer--sm);
  --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view__node--indent--base);
  --pf-c-tree-view__node--Color: var(--pf-global--Color--100);
  --pf-c-tree-view__node--m-current--Color: var(--pf-global--link--Color);
  --pf-c-tree-view__node--m-current--FontWeight: var(--pf-global--FontWeight--bold);

  // link hover/focus
  --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
  --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--palette--black-200);

  // toggle 90degon
  --pf-c-tree-view__node-toggle--PaddingRight: var(--pf-global--spacer--sm);
  --pf-c-tree-view__node-toggle--MinWidth: var(--pf-global--spacer--lg);
  --pf-c-tree-view__node-toggle--MinHeight: var(--pf-c-tree-view__node-toggle--icon--MinWidth);

  // Toggle icon
  --pf-c-tree-view__node-toggle--Transition: var(--pf-global--Transition);

  // check
  --pf-c-tree-view__node-check--MarginRight: var(--pf-global--spacer--sm);

  // badge
  --pf-c-tree-view__node-count--MarginLeft: var(--pf-global--spacer--sm);
  --pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);

  // search
  --pf-c-tree-view__search--PaddingTop: var(--pf-global--spacer--sm);
  --pf-c-tree-view__search--PaddingRight: var(--pf-global--spacer--sm);
  --pf-c-tree-view__search--PaddingBottom: var(--pf-global--spacer--sm);
  --pf-c-tree-view__search--PaddingLeft: var(--pf-global--spacer--sm);

  // icon
  --pf-c-tree-view__node-icon--PaddingRight: var(--pf-global--spacer--sm);
  --pf-c-tree-view__node-icon--Color: var(--pf-global--icon--Color--light);

  // text
  --pf-c-tree-view__node-text--max-lines: 1;

  // action
  --pf-c-tree-view__action--MarginLeft: var(--pf-global--spacer--md);
  --pf-c-tree-view__action--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
  --pf-c-tree-view__action--Color: var(--pf-global--icon--Color--light);
  --pf-c-tree-view__action--hover--Color: var(--pf-global--icon--Color--dark);
  --pf-c-tree-view__action--focus--Color: var(--pf-global--icon--Color--dark);

  padding-top: var(--pf-c-tree-view--PaddingTop);
  padding-bottom: var(--pf-c-tree-view--PaddingBottom);
}

// stylelint-disable
.pf-c-tree-view__list-item {
  &.pf-m-expanded {
    > .pf-c-tree-view__content > .pf-c-tree-view__node > .pf-c-tree-view__node-toggle > .pf-c-tree-view__node-toggle-icon {
      transform: rotate(90deg);
    }
  }
}
// stylelint-enable

.pf-c-tree-view__node {
  display: flex;
  flex: 1 1;
  align-items: center;
  min-width: 0;
  padding: var(--pf-c-tree-view__node--PaddingTop) var(--pf-c-tree-view__node--PaddingRight) var(--pf-c-tree-view__node--PaddingBottom) var(--pf-c-tree-view__node--PaddingLeft);
  color: var(--pf-c-tree-view__node--Color);
  text-align: left;
  cursor: pointer;
  border: 0;

  &.pf-m-current {
    --pf-c-tree-view__node--Color: var(--pf-c-tree-view__node--m-current--Color);

    font-weight: var(--pf-c-tree-view__node--m-current--FontWeight);
  }

  &:focus {
    background-color: var(--pf-c-tree-view__node--focus--BackgroundColor);
  }

  .pf-c-tree-view__node-count {
    margin-left: var(--pf-c-tree-view__node-count--MarginLeft);

    .pf-c-badge.pf-m-read {
      --pf-c-badge--m-read--BackgroundColor: var(--pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor);
    }
  }
}

.pf-c-tree-view__node-toggle-icon {
  transition: var(--pf-c-tree-view__node-toggle--Transition);
}

.pf-c-tree-view__node-check {
  margin-right: var(--pf-c-tree-view__node-check--MarginRight);
}

.pf-c-tree-view__node-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--pf-c-tree-view__node-toggle--MinWidth);
  min-height: var(--pf-c-tree-view__node-toggle--MinHeight);
  padding-right: var(--pf-c-tree-view__node-toggle--PaddingRight);
}

.pf-c-tree-view__node-text {
  @include pf-text-overflow;
}

.pf-c-tree-view__search {
  padding: var(--pf-c-tree-view__search--PaddingTop) var(--pf-c-tree-view__search--PaddingRight) var(--pf-c-tree-view__search--PaddingBottom) var(--pf-c-tree-view__search--PaddingLeft);
}

.pf-c-tree-view__node-icon {
  padding-right: var(--pf-c-tree-view__node-icon--PaddingRight);
  color: var(--pf-c-tree-view__node-icon--Color);
}

.pf-c-tree-view__content {
  display: flex;
  align-items: center;
}

.pf-c-tree-view__content:hover,
.pf-c-tree-view__content:focus-within {
  background-color: var(--pf-c-tree-view__node--hover--BackgroundColor);
}

.pf-c-tree-view__action {
  margin-left: var(--pf-c-tree-view__action--MarginLeft);
  color: var(--pf-c-tree-view__action--Color);
  border: 0;

  &:hover {
    --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--hover--Color);
  }

  &:focus {
    --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--focus--Color);

    background-color: var(--pf-c-tree-view__action--focus--BackgroundColor);
  }
}

// stylelint-disable no-duplicate-selectors
.pf-c-tree-view__list-item {
  $root: &;
  $nested-item: &;

  @for $i from 1 through $pf-c-tree-view--MaxNesting {
    #{$nested-item} {
      --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--indent--base) + (var(--pf-c-tree-view__node--nested-indent--base) * #{$i}));
    }

    #{$nested-item}.pf-m-expandable {
      --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--indent--base) + (var(--pf-c-tree-view__item--m-expandable__node--nested-indent--base) * #{$i}));
    }

    $nested-item: $nested-item + " " + $root;
  }
}
// stylelint-enable
